import React,{useState,useEffect} from 'react'
import './index.css'
import axios from 'axios'
import { BrowserRouter as Router, Route, Routes,useNavigate } from 'react-router-dom'
export default function Index() {
	const navgiate=useNavigate()
	const [pei,setPei]=useState([])
	const [shangtype,setShangtype]=useState([])
	const [list,setList]=useState([])
	const [is_mo,setIs_mo]=useState(false)
	const [is_typeall,setIs_typeall]=useState(false)
	const [is_Pei,setIs_pei]=useState(false)
	const [s_km,setKm]=useState(1)
	const [s_shangtype,setS_shangtype]=useState('')
	const [s_pei,setS_Pei]=useState('')
	const getType=()=>{
		axios.get(`http://localhost:3000/shangtype`).then(res=>{
			let {code,data}=res.data
			setShangtype(data)
		})
	}
	const getpei=()=>{
		axios.get(`http://localhost:3000/pei`).then(res=>{
			let {code,data}=res.data
			setPei(data)
		})
	}
	const getdianpu=()=>{
		axios.get(`http://localhost:3000/dianpu?s_km=${s_km}&s_shangtype=${s_shangtype}&s_pei=${s_pei}`).then(res=>{
			let {code,data}=res.data
			setPei(data)
		})
	}
	useEffect(()=>{
		getType()
		getpei()
		getdianpu()
	},[])
	return (
		<div>
			<nav className='main'>
				<div className='header'>
					<span style={{fontSize:'20px'}}>📍佛山</span>
					<span style={{fontSize:'34px'}}>美团点餐</span>
					<span></span>
				</div>
				<div className='jinbu'>
					<span>默认排序&nbsp;&nbsp;V</span>
					<span>全部美食&nbsp;&nbsp;V</span>
					<span>筛选&nbsp;&nbsp;V</span>
				</div>
				<div>
					{list}
				</div>
			</nav>
		</div>
	)
}
